<template>
    <el-table v-loading="loading" :data="recordList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center" />
        <el-table-column label="记录编号" align="center" prop="recordCode" />
        <el-table-column label="商品名称" align="center" prop="goodsName" />
        <el-table-column label="记录类型" align="center" prop="recordType">
            <template slot-scope="scope">
                <dict-tag :options="dict.type.stock_record_type" :value="scope.row.recordType" />
            </template>
        </el-table-column>
        <el-table-column label="记录子类型" align="center" prop="recordSubtype">
            <template slot-scope="scope">
                <dict-tag :options="dict.type.stock_record_subtype" :value="scope.row.recordSubtype" />
            </template>
        </el-table-column>
        <el-table-column label="记录日期" align="center" prop="recordDate" width="180">
            <template slot-scope="scope">
                <span>{{ parseTime(scope.row.recordDate, '{y}-{m}-{d}') }}</span>
            </template>
        </el-table-column>
        <el-table-column label="数量" align="center" prop="quantity" />
        <el-table-column label="单价" align="center" prop="unitPrice" />
        <el-table-column label="总金额" align="center" prop="totalAmount" />
        <el-table-column label="供应商" align="center" prop="supplierName" />
        <el-table-column label="客户" align="center" prop="customerName" />
        <el-table-column label="仓库" align="center" prop="warehouseName" />
        <el-table-column label="目标仓库" align="center" prop="targetWarehouseName" />
        <el-table-column label="操作人" align="center" prop="operatorName" />
        <el-table-column label="审核人" align="center" prop="approverName" />
        <el-table-column label="审核时间" align="center" prop="approvalTime" width="180">
            <template slot-scope="scope">
                <span>{{ parseTime(scope.row.approvalTime, '{y}-{m}-{d}') }}</span>
            </template>
        </el-table-column>
        <el-table-column label="审核状态" align="center" prop="approvalStatus">
            <template slot-scope="scope">
                <dict-tag :options="dict.type.stock_approval_status" :value="scope.row.approvalStatus" />
            </template>
        </el-table-column>
        <el-table-column label="记录状态" align="center" prop="recordStatus">
            <template slot-scope="scope">
                <dict-tag :options="dict.type.stock_record_status" :value="scope.row.recordStatus" />
            </template>
        </el-table-column>
        <el-table-column label="批次号" align="center" prop="batchNumber" />
        <el-table-column label="有效期" align="center" prop="expiryDate" width="180">
            <template slot-scope="scope">
                <span>{{ parseTime(scope.row.expiryDate, '{y}-{m}-{d}') }}</span>
            </template>
        </el-table-column>
        <el-table-column label="备注" align="center" prop="recordRemark" />
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template slot-scope="scope">
                <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
                    v-hasPermi="['system:record:edit']">修改</el-button>
                <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                    v-hasPermi="['system:record:remove']">删除</el-button>
                <el-button size="mini" type="text" icon="el-icon-check" @click="handleApprove(scope.row)"
                    v-hasPermi="['system:record:approve']" v-if="scope.row.approvalStatus === '0'">审核</el-button>
                <el-button size="mini" type="text" icon="el-icon-close" @click="handleCancel(scope.row)"
                    v-hasPermi="['system:record:cancel']" v-if="scope.row.approvalStatus === '1'">取消审核</el-button>
            </template>
        </el-table-column>
    </el-table>
</template>

<script>
export default {
    name: "RecordTable",
    dicts: ['stock_record_type', 'stock_record_subtype', 'stock_approval_status', 'stock_record_status'],
    props: {
        // 遮罩层
        loading: {
            type: Boolean,
            default: true
        },
        // 库存记录列表
        recordList: {
            type: Array,
            default: () => []
        }
    },
    data() {
        return {
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true
        };
    },
    methods: {
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.id)
            this.single = selection.length !== 1
            this.multiple = !selection.length
            this.$emit('selection-change', selection)
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            this.$emit('update', row)
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            this.$emit('delete', row)
        },
        /** 审核按钮操作 */
        handleApprove(row) {
            this.$emit('approve', row)
        },
        /** 取消审核按钮操作 */
        handleCancel(row) {
            this.$emit('cancel', row)
        }
    }
};
</script>

<style lang="scss" scoped>
.record-table {
    .record-table-column {
        &.small-padding {
            padding: 8px 0;
        }

        &.fixed-width {
            width: 200px;
        }
    }
}
</style>